import Mapwindow from './Mapwindow'

class AlarmPoint {
  constructor({map,point,data,mkopts={},wdopts={width:270,isShow:true}}) {
    this.obj = new AMap.OverlayGroup();
    this.map = map;
    this.point = point;
    this.data = data;
    this.mkopts = mkopts;
    this.wdopts = wdopts;
    this._init();
  }

  _init(){
    // 初始化marker
    this.marker = new AMap.Marker({
      map:this.map,
      position:this.point,
      ...this.mkopts
    });

    this.infowindow = new Mapwindow({
      map:this.map,
      position:this.point,
      ...this.wdopts
    });

    this.obj.addOverlay(this.marker);
    this.obj.addOverlay(this.infowindow);

    let wdcontent = this._createWindowContent();
    this.infowindow.setHtml(wdcontent);

    // this.map.setCenter(this.point);

    // marker点击事件
    this.marker.on('click',() => {
      this.infowindow.show();
    });
  }

  _createWindowContent(){
    let div = document.createElement('div');
    let table = document.createElement('table');
    table.className = 'infowindow-table';
    table.style.width = this.wdopts.width + 'px';
    table.style.fontSize = '13px';

    for (let [key, value] of Object.entries(this.data)) {
      let tr = `<tr>
                  <td class="label" style="${this.wdopts.labelWidth?'width:'+this.wdopts.labelWidth:'width:35%;'}">${key}：</td>
                  <td>${value||''}</td>
                </tr>`;
      table.innerHTML += tr;
    }

    div.appendChild(table);
    return div;
  }

  setPosition(point){
    this.marker.setPosition(point);
    this.infowindow.setPosition(point);
  }

  removeToMap(){
    this.marker.setMap(null);
    this.infowindow.setMap(null);
  }
}

export default AlarmPoint;
